<template>
	<router-view/>
	<div>当前版本:{{ version }}</div>
	<div>downloadPercent:{{ downloadPercent }}</div>
	<div>{{ tips }}</div>
	<button @click="onUpdate">更新</button>
</template>

<script lang="ts">
import { Options, Vue } from 'vue-class-component';
import HelloWorld from './components/HelloWorld.vue';
import { ipcRenderer } from "electron";
import { app } from "@electron/remote";

@Options({
	components: {
		HelloWorld,
	},
	data() {
		return {
			downloadPercent: undefined,
			tips: undefined,
			version: undefined,
		}
	},
	created() {
		ipcRenderer.on("message", (event: any, text: string) => {
			console.group('message');
			// console.log('arguments', arguments);
			console.log('text', text);
			console.groupEnd();
			this.tips = text;
			// alert(text)
		});

		ipcRenderer.on("downloadProgress", (event: any, progressObj: any) => {
			console.group('downloadProgress');
			console.log(progressObj.percent);
			console.groupEnd();
			this.downloadPercent = progressObj.percent || 0;
		});

		ipcRenderer.on("isUpdateNow", () => {
			console.group('isUpdateNow');
			console.groupEnd();
			ipcRenderer.send("isUpdateNow");
		});

		ipcRenderer.on("appInfo", (event: any, progressObj: any) => {
			console.group('appInfo');
			console.log(progressObj)
			console.groupEnd();
			this.version = progressObj.version;
		});
	},

	methods: {
		onUpdate() {
			ipcRenderer.send("checkForUpdate");
		}
	},

	mounted() {
		console.log('this.$route', this.$route);
		console.log('this.$router', this.$router);
		// 通知检测更新
		setTimeout(() => {
			ipcRenderer.send("checkForUpdate");
		}, 3000)
	},
})
export default class App extends Vue {
}
</script>

<style lang="less">
body {
	background: white;
}

.nav {
	.user {
		color: red;
	}
}
</style>
